<template>
  <div style="height:100%;overflow-y:auto">
  <Row>
    <Col span="8">
    </Col>
    <Col span="16">
    <Row style="text-align: center;">
      <h1>个人信用报告</h1>
      <h3>（2011银行版）</h3>
    </Row>
    <Card>
      <Row style="text-align: center;">
        <h2>个人基本信息</h2>
      </Row>
      <br>
      <Form  :label-width="100" inline>
        <FormItem label="报告编号" prop="">
          <Input v-model="intBankBasic.serialNumber" readonly></Input>
        </FormItem>
        <FormItem label="查询请求时间" prop="">
          <Input  v-model="intBankBasic.requestDate" readonly></Input>
        </FormItem>
        <FormItem label="报告时间" prop="">
          <Input  v-model="intBankBasic.respondDate" readonly></Input>
        </FormItem>
        <br>
        <FormItem label="被查询者姓名" prop="">
          <Input  v-model="intBankBasic.applicantName" readonly></Input>
        </FormItem>
        <FormItem label="被查询者姓名" prop="">
          <Input  v-model="intBankBasic.applicantIdType" readonly></Input>
        </FormItem>
        <FormItem label="被查询者姓名" prop="">
          <Input  v-model="intBankBasic.applicantIdNbr" readonly></Input>
        </FormItem>
        <FormItem label="被查询者姓名" prop="">
          <Input  v-model="intBankBasic.operateName" readonly></Input>
        </FormItem>
        <FormItem label="查询原因" prop="">
          <Input  v-model="intBankBasic.operateName" readonly></Input>
        </FormItem>
        <br>
        <Collapse v-model="value1">
          <Panel name="1">身份信息
            <div slot="content">
              <FormItem label="性别" prop="">
                <Input v-model="intBankBasic.applicantSex" readonly></Input>
              </FormItem>
              <FormItem label="出生日期" prop="">
                <Input  v-model="intBankBasic.applicantBirthDate" readonly></Input>
              </FormItem>
              <FormItem label="婚姻状况" prop="">
                <Input v-model="intBankBasic.maritalStatus" readonly></Input>
              </FormItem>
              <FormItem label="手机号码" prop="">
                <Input v-model="intBankBasic.cellphnoneNbr" readonly></Input>
              </FormItem>
              <FormItem label="单位电话" prop="">
                <Input v-model="intBankBasic.companyTel" readonly></Input>
              </FormItem>
              <FormItem label="住宅电话" prop="">
                <Input v-model="intBankBasic.residenceTel" readonly></Input>
              </FormItem>
              <FormItem label="学历" prop="">
                <Input v-model="intBankBasic.eductionLevelId" readonly></Input>
              </FormItem>
              <FormItem label="学位" prop="">
                <Input v-model="intBankBasic.educationBackground" readonly></Input>
              </FormItem>
              <FormItem label="通讯地址" prop="">
                <Input v-model="intBankBasic.mailingAddress" readonly></Input>
              </FormItem>
              <FormItem label="户籍地址" prop="">
                <Input v-model="intBankBasic.applicantHukoAddr" readonly></Input>
              </FormItem>
            </div>
          </Panel>
          <Panel name="2">配偶信息
            <div slot="content">
              <FormItem label="姓名" prop="">
                <Input v-model="intBankBasic.spouseName" readonly></Input>
              </FormItem>
              <FormItem label="证件类型" prop="">
                <Input v-model="intBankBasic.spouseApplicantIdType" readonly></Input>
              </FormItem>
              <FormItem label="证件号码" prop="">
                <Input v-model="intBankBasic.spouseIdNbr" readonly></Input>
              </FormItem>
              <FormItem label="联系电话" prop="">
                <Input v-model="intBankBasic.spouseTel" readonly></Input>
              </FormItem>
              <FormItem label="工作单位" prop="">
                <Input v-model="intBankBasic.spouseCompanyName" readonly></Input>
              </FormItem>
            </div>
          </Panel>
          <Panel name="3">居住信息
            <div slot="content">
              <Table style="margin-left:15px;margin-top:5px;" :columns="columns1" :data="dwellmessageList"></Table>
            </div>
          </Panel>
          <Panel name="4">职业信息
            <div slot="content">
              <Table style="margin-left:15px;margin-top:5px;" :columns="columns2" :data="intBankPositionmesageList"></Table>
            </div>
          </Panel>
        </Collapse>
      </Form>
    </Card>
    <br>

    <Row style="text-align: center;">
      <h2>信息概要</h2>
    </Row>

    <Collapse v-model="value2">
      <Panel name="1"> （一）信用提示
        <div slot="content">
          <Form  :label-width="100" inline>
            <FormItem label="住房贷款笔数" prop="">
              <Input v-model="intBankCredittipsForm.lodgingCount" readonly></Input>
            </FormItem>
            <FormItem label="其他贷款笔数" prop="">
              <Input v-model="intBankCredittipsForm.elseCount" readonly></Input>
            </FormItem>
            <FormItem label="首笔贷款发放月份" prop="">
              <Input  v-model="intBankCredittipsForm.firstMonth" readonly></Input>
            </FormItem>
            <FormItem label="贷记卡账户数" prop="">
              <Input v-model="intBankCredittipsForm.creditCount" readonly></Input>
            </FormItem>
            <FormItem label="首张贷记卡发卡月份" prop="">
              <Input  v-model="intBankCredittipsForm.firstCreditMonth" readonly></Input>
            </FormItem>
            <FormItem label="准贷记卡账户数" prop="">
              <Input v-model="intBankCredittipsForm.quasiCreditCount" readonly></Input>
            </FormItem>
            <FormItem label="首张准贷记卡发卡月份" prop="">
              <Input  v-model="intBankCredittipsForm.quasiCreditMonth" readonly></Input>
            </FormItem>
            <FormItem label="本人声明数目" prop="">
              <Input v-model="intBankCredittipsForm.statementCount" readonly></Input>
            </FormItem>
            <FormItem label="异议标注数目" prop="">
              <Input v-model="intBankCredittipsForm.objectionCount" readonly></Input>
            </FormItem>
          </Form>

        </div>
      </Panel>
      <Panel name="2">（二）授信及负债信息概要
        <div slot="content">
          <Card>
            <Form :label-width="100" inline>
              <Row style="text-align: center;">
                <h4>未结清贷款信息汇总</h4>
              </Row>
              <FormItem label="贷款法人机构数" prop="">
                <Input v-model="intBankNotCredittipsForm.legalpersonCount" readonly></Input>
              </FormItem>
              <FormItem label="贷款机构数" prop="">
                <Input v-model="intBankNotCredittipsForm.organizationCount" readonly></Input>
              </FormItem>
              <FormItem label="笔数" prop="">
                <Input v-model="intBankNotCredittipsForm.count" readonly></Input>
              </FormItem>
              <FormItem label="合同总额" prop="">
                <Input v-model="intBankNotCredittipsForm.bargainRental" readonly></Input>
              </FormItem>
              <FormItem label="余额" prop="">
                <Input v-model="intBankNotCredittipsForm.bargainBalance" readonly></Input>
              </FormItem>
              <FormItem label="最近6个月平均应还款" prop="">
                <Input v-model="intBankNotCredittipsForm.averageRefund" readonly></Input>
              </FormItem>
            </Form>
          </Card>
          <br>
          <Card>
            <Form  :label-width="100" inline>
              <Row style="text-align: center;">
                <h4>未销户贷记卡信息汇总</h4>
              </Row>
              <FormItem label="发卡法人机构数" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.legalPersonCount" readonly></Input>
              </FormItem>
              <FormItem label="发卡机构数" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.organizationCount" readonly></Input>
              </FormItem>
              <FormItem label="帐户数" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.accountCount" readonly></Input>
              </FormItem>
              <FormItem label="授信总额" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.creditExtensionRental" readonly></Input>
              </FormItem>
              <FormItem label="单家行最高授信额" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.highest" readonly></Input>
              </FormItem>
              <FormItem label="单家行最低授信额" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.minimum" readonly></Input>
              </FormItem>
              <FormItem label="已用额度" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.beenUsed" readonly></Input>
              </FormItem>
              <FormItem label="最近6个月平均使用额度" prop="">
                <Input v-model="intBankNotPinshouseholdsForm.averageBalance" readonly></Input>
              </FormItem>
            </Form>
          </Card>
          <br>
          <Card>
            <Form  :label-width="100" inline>
              <Row style="text-align: center;">
                <h4>未销户准贷记卡信息汇总</h4>
              </Row>
              <FormItem label="发卡法人机构数" prop="">
                <Input v-model="intBankNotQuasiCreditForm.legalPersonCount" readonly></Input>
              </FormItem>
              <FormItem label="发卡机构数" prop="">
                <Input v-model="intBankNotQuasiCreditForm.organizationCount" readonly></Input>
              </FormItem>
              <FormItem label="帐户数" prop="">
                <Input v-model="intBankNotQuasiCreditForm.accountCount" readonly></Input>
              </FormItem>
              <FormItem label="授信总额" prop="">
                <Input v-model="intBankNotQuasiCreditForm.creditExtensionRental" readonly></Input>
              </FormItem>
              <FormItem label="单家行最高授信额" prop="">
                <Input v-model="intBankNotQuasiCreditForm.highest" readonly></Input>
              </FormItem>
              <FormItem label="单家行最低授信额" prop="">
                <Input v-model="intBankNotQuasiCreditForm.minimum" readonly></Input>
              </FormItem>
              <FormItem label="透支余度" prop="">
                <Input v-model="intBankNotQuasiCreditForm.overdraftBalance" readonly></Input>
              </FormItem>
              <FormItem label="最近6个月平均使用额度" prop="">
                <Input v-model="intBankNotQuasiCreditForm.averageBalance" readonly></Input>
              </FormItem>
            </Form>
          </Card>
          <br>
          <Card>
            <Form  :label-width="100" inline>
              <Row style="text-align: center;">
                <h4>对外担保信息汇总</h4>
              </Row>
              <FormItem label="担保笔数" prop="">
                <Input v-model="intBankGuaranteeCountForm.loanCount" readonly></Input>
              </FormItem>
              <FormItem label="担保金额" prop="">
                <Input v-model="intBankGuaranteeCountForm.loanRental" readonly></Input>
              </FormItem>
              <FormItem label="提保本金余额" prop="">
                <Input v-model="intBankGuaranteeCountForm.sharedLines" readonly></Input>
              </FormItem>
            </Form>
          </Card>

        </div>
      </Panel>
    </Collapse>
    <br>
    <Row style="text-align: center;">
      <h2>信贷交易信息明细</h2>
    </Row>
    <Collapse v-model="value3">
      <Panel name="1">（一）贷款
        <div slot="content">
          <Card>
            <Row v-for="(item, index) in intBankCreditPaymentJQList" :key="index">
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label v-html="index+1"></label>
                </Col>
                <Col span="3">
                <Input   v-model="item.loanDate"></Input>
                </Col>
                <Col span="1">
                <label>机构</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.loanOrganization" readonly></Input>
                </Col>
                <Col span="1">
                <label>发放的</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanRental" readonly></Input>
                </Col>
                <Col span="2">
                <label>元（人民币）</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanNature" readonly></Input>
                </Col>
                <Col span="2">
                <label>，业务号</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.mark" readonly></Input>
                </Col>
              </Row>
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.markType" readonly></Input>
                </Col>
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="1">
                <Input  v-model="item.deadline" readonly></Input>
                </Col>
                <Col span="1">
                <label>期</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.refundType" readonly></Input>
                </Col>
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanExpire"></DatePicker>
                </Col>
                <Col span="2">
                <label>到期，已于</label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.endExpire"></DatePicker>
                </Col>
                <Col span="2">
                <Input v-model="item.loanType" readonly></Input>
                </Col>
              </Row>
              <br>
            </Row>
            <Row v-for="(item, index) in intBankCreditPaymentNJQList" :key="intBankCreditPaymentNJQList.length+index">
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label v-html="item.length+index+1"></label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanDate"></DatePicker>
                </Col>
                <Col span="1">
                <label>机构</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.loanOrganization" readonly></Input>
                </Col>
                <Col span="1">
                <label>发放的</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanRental" readonly></Input>
                </Col>
                <Col span="2">
                <label>元（人民币）</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanNature" readonly></Input>
                </Col>
                <Col span="2">
                <label>，业务号</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.mark" readonly></Input>
                </Col>
              </Row>
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.markType" readonly></Input>
                </Col>
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="1">
                <Input  v-model="item.deadline" readonly></Input>
                </Col>
                <Col span="1">
                <label>期</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.refundType" readonly></Input>
                </Col>
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanExpire"></DatePicker>
                </Col>
                <Col span="2">
                <label>到期，截至</label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.endExpire"></DatePicker>
                </Col>
                <Col span="2">
                <Input v-model="item.loanType" readonly></Input>
                </Col>
              </Row>
              <br>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>帐户状态</label>
                </Col>
                <Col span="4">
                <Input v-model="item.accountType" readonly></Input>
                </Col>
                <Col span="4">
                <label>五级分类</label>
                </Col>
                <Col span="4">
                <Input v-model="item.classify" readonly></Input>
                </Col>
                <Col span="4">
                <label>本金余额</label>
                </Col>
                <Col span="4">
                <Input v-model="item.haveUsedLimit" readonly></Input>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>剩余还款期数</label>
                </Col>
                <Col span="4">
                <Input v-model="item.restPeriods" readonly></Input>
                </Input>
                </Col>
                <Col span="4">
                <label>本月应还款</label>
                </Col>
                <Col span="4">
                <Input v-model="item.shouldReimbursement" readonly></Input>
                </Col>
                <Col span="4">
                <label>应还款日</label>
                </Col>
                <Col span="4">
                <DatePicker  v-model="item.reimbursement"></DatePicker>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>本月实还款</label>
                </Col>
                <Col span="4">
                <Input v-model="itemitem.solidRepayment" readonly></Input>
                </Input>
                </Col>
                <Col span="4">
                <label>最近一次还款日期</label>
                </Col>
                <Col span="4">
                <DatePicker  v-model="item.recentRepaymentDate"></DatePicker>
                </Col>
                <Col span="4">
                <label>当前逾期期数</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overduePeriods" readonly></Input>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>当前逾期金额</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overdueAmount" readonly></Input>
                </Input>
                </Col>
                <Col span="4">
                <label>逾期31-60天未还本金</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overdue60Principal" readonly></Input>
                </Col>
                <Col span="4">
                <label>逾期61-90天未还本金</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overdue90Principal" readonly></Input>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>逾期91-180天未还本金</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overdue180Principal" readonly></Input>
                </Col>
                <Col span="4">
                <label>逾期180天以上未还本金</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overdue180morePrincipal" readonly></Input>
                </Col>
                <Col span="8"></Col>
              </Row>
              <Row style="text-align: center;">
                <h3>还款记录</h3>
              </Row>
              <Row>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore1month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore2month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore3month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore4month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore5month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore6month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore7month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore8month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore9month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore10month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore11month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore12month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore13month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore14month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore15month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore16month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore17month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore18month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore19month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore20month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore21month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore22month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore23month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore24month" readonly></Input>
                </Col>
              </Row>
              <br>
            </Row>
          </Card>
        </div>
      </Panel>
      <Panel name="2">
        （二）贷记卡
        <div slot="content">
          <Card>
            <Row v-for="(item, index) in intBankCreditCardXhRecordList" :key="index">
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label v-html="index+1"></label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanDate"></DatePicker>
                </Col>
                <Col span="1">
                <label>机构</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.loanOrganization" readonly></Input>
                </Col>
                <Col span="1">
                <label>发放的</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanType" readonly></Input>
                </Col>
                <Col span="2">
                <label>，业务号</label>
                </Col>
                <Col span="4">
                <Input  v-model="item.mark" readonly></Input>
                </Col>
                <Col span="2">
                <label>，授信额度</label>
                </Col>
                <Col span="3">
                <Input  v-model="item.loanRental" readonly></Input>
                </Col>

              </Row>
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label>， </label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanNature" readonly></Input>
                </Col>
                <Col span="2">
                <label>，截至</label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanExpire"></DatePicker>
                </Col>
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.accountType" readonly></Input>
                </Col>
                <Col span="11"></Col>
              </Row>
              <br>
            </Row>
            <Row v-for="(item, index) in intBankCreditCardNXhRecordList" :key="intBankCreditCardXhRecordList.length+index">
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label v-html="item.length+index+1"></label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanDate"></DatePicker>
                </Col>
                <Col span="1">
                <label>机构</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.loanOrganization" readonly></Input>
                </Col>
                <Col span="1">
                <label>发放的</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanType" readonly></Input>
                </Col>
                <Col span="2">
                <label>，业务号</label>
                </Col>
                <Col span="4">
                <Input  v-model="item.mark" readonly></Input>
                </Col>
                <Col span="2">
                <label>，授信额度</label>
                </Col>
                <Col span="3">
                <Input  v-model="item.loanRental" readonly></Input>
                </Col>
              </Row>
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label>， </label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanNature" readonly></Input>
                </Col>
                <Col span="2">
                <label>，截至</label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanExpire"></DatePicker>
                </Col>
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.accountType" readonly></Input>
                </Col>
                <Col span="11"></Col>
              </Row>
              <br>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>帐户状态</label>
                </Col>
                <Col span="4">
                <Input v-model="item.accountTypeTwo" readonly></Input>
                </Col>
                <Col span="4">
                <label>已用额度</label>
                </Col>
                <Col span="4">
                <Input v-model="item.haveUsedLimit" readonly></Input>
                </Col>
                <Col span="4">
                <label>最近6个月平均使用额度</label>
                </Col>
                <Col span="4">
                <Input v-model="item.averageUsageLimit" readonly></Input>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>最大使用额度</label>
                </Col>
                <Col span="4">
                <Input v-model="item.theBiggestLimit" readonly></Input>
                </Input>
                </Col>
                <Col span="4">
                <label>本月应还款</label>
                </Col>
                <Col span="4">
                <Input v-model="item.shouldReimbursement" readonly></Input>
                </Col>
                <Col span="4">
                <label>帐单日</label>
                </Col>
                <Col span="4">
                <DatePicker  v-model="item.reimbursement"></DatePicker>
                </Col>
              </Row>

              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>本月实还款</label>
                </Col>
                <Col span="4">
                <Input v-model="item.solidRepayment" readonly></Input>
                </Input>
                </Col>
                <Col span="4">
                <label>最近一次还款日期</label>
                </Col>
                <Col span="4">
                <DatePicker  v-model="item.recentRepaymentDate"></DatePicker>
                </Col>
                <Col span="4">
                <label>当前逾期期数</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overduePeriods" readonly></Input>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>当前逾期金额</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overdueAmount" readonly></Input>
                </Input>
                </Col>
                <Col span="16"></Col>
              </Row>
              <Row style="text-align: center;">
                <h4>还款记录</h4>
              </Row>
              <Row>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore24month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore23month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore22month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore21month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore20month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore19month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore18month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore17month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore16month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore15month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore14month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore13month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore12month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore11month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore10month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore9month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore8month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore7month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore6month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore5month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore4month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore3month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore2month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore1month" readonly></Input>
                </Col>
              </Row>
              <br>
            </Row>
          </Card>
        </div>
      </Panel>
      <Panel name="3">
        （三）准贷记卡
        <div slot="content">
          <Card>
            <Row v-for="(item, index) in intBankStandardCreditCardsList" :key="index">
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label v-html="index+1"></label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanDate"></DatePicker>
                </Col>
                <Col span="1">
                <label>机构</label>
                </Col>
                <Col span="5">
                <Input  v-model="item.loanOrganization" readonly></Input>
                </Col>
                <Col span="1">
                <label>发放的</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanType" readonly></Input>
                </Col>
                <Col span="2">
                <label>，业务号</label>
                </Col>
                <Col span="4">
                <Input  v-model="item.mark" readonly></Input>
                </Col>
                <Col span="2">
                <label>，授信额度</label>
                </Col>
                <Col span="3">
                <Input  v-model="item.loanRental" readonly></Input>
                </Col>
              </Row>
              <Row type="flex" justify="center" align="middle">
                <Col span="1">
                <label>， </label>
                </Col>
                <Col span="2">
                <Input  v-model="item.loanNature" readonly></Input>
                </Col>
                <Col span="2">
                <label>，截至</label>
                </Col>
                <Col span="3">
                <DatePicker   v-model="item.loanExpire"></DatePicker>
                </Col>
                <Col span="1">
                <label>，</label>
                </Col>
                <Col span="2">
                <Input  v-model="item.accountType" readonly></Input>
                </Col>
                <Col span="11"></Col>
              </Row>
              <br>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>帐户状态</label>
                </Col>
                <Col span="4">
                <Input v-model="item.accountTypeTwo" readonly></Input>
                </Col>
                <Col span="4">
                <label>透支余额</label>
                </Col>
                <Col span="4">
                <Input v-model="item.haveUsedLimit" readonly></Input>
                </Col>
                <Col span="4">
                <label>最近6个月平均透支余额</label>
                </Col>
                <Col span="4">
                <Input v-model="item.averageUsageLimit" readonly></Input>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>最大透支余额</label>
                </Col>
                <Col span="4">
                <Input v-model="item.shouldReimbursement" readonly></Input>
                </Input>
                </Col>
                <Col span="4">
                <label>帐单日</label>
                </Col>
                <Col span="4">
                <DatePicker  v-model="item.reimbursement"></DatePicker>
                </Col>
                <Col span="4">
                <label>本月实还款</label>
                </Col>
                <Col span="4">
                <Input v-model="item.solidRepayment" readonly></Input>
                </Col>
              </Row>
              <Row :gutter="16" type="flex" justify="center" align="middle">
                <Col span="4">
                <label>最近一次还款日期</label>
                </Col>
                <Col span="4">
                <DatePicker  v-model="item.recentRepaymentDate"></DatePicker>
                </Col>
                <Col span="4">
                <label>透支180天以上未付余额</label>
                </Col>
                <Col span="4">
                <Input v-model="item.overdueAmount" readonly></Input>
                </Col>
                <Col span="8"></Col>
              </Row>
              <br>
              <Row style="text-align: center;">
                <h4>还款记录</h4>
              </Row>
              <Row>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore24month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore23month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore22month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore21month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore20month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore19month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore18month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore17month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore16month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore15month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore14month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore13month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore12month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore11month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore10month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore9month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore8month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore7month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore6month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore5month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore4month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore3month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore2month" readonly></Input>
                </Col>
                <Col span="1">
                <Input v-model="item.paymentHistoryBefore1month" readonly></Input>
                </Col>
              </Row>
              <br>
            </Row>
          </Card>
        </div>
      </Panel>
    </Collapse>
    <Card>
      <Row style="text-align: center;">
        <h2 style="color:red">四 公共信息明细</h2>
      </Row>
    </Card>
    <Collapse v-model="value4">
      <Panel name="1">
        养老保险金缴存记录
        <div slot="content">
          <Form  :label-width="100" inline>
            <FormItem label="参保地" prop="">
              <Input v-model="intBankEndowmentInsuranceForm.loanOrganization" readonly></Input>
            </FormItem>
            <FormItem label="参保日期" prop="">
              <Input  v-model="intBankEndowmentInsuranceForm.loanDate"></Input>
            </FormItem>
            <FormItem label="累计缴费月数" prop="">
              <Input v-model="intBankEndowmentInsuranceForm.aggregate" readonly></Input>
            </FormItem>
            <FormItem label="参加工作月份" prop="">
              <Input  v-model="intBankEndowmentInsuranceForm.reimbursement"></Input>
            </FormItem>
            <FormItem label="缴费状态" prop="">
              <Input v-model="intBankEndowmentInsuranceForm.payCostType" readonly></Input>
            </FormItem>
            <FormItem label="个人缴费基数" prop="">
              <Input v-model="intBankEndowmentInsuranceForm.overdueAmount" readonly></Input>
            </FormItem>
            <FormItem label="本月缴费金额" prop="">
              <Input v-model="intBankEndowmentInsuranceForm.solidRepayment" readonly></Input>
            </FormItem>
            <FormItem label="信息更新日期" prop="">
              <Input  v-model="intBankEndowmentInsuranceForm.updateDate"></Input>
            </FormItem>
            <FormItem label="缴费单位" prop="">
              <Input v-model="intBankEndowmentInsuranceForm.payCostUnit" readonly></Input>
            </FormItem>
            <FormItem label="中断或终止缴费原因" prop="">
              <Input v-model="intBankEndowmentInsuranceForm.cause" readonly></Input>
            </FormItem>
          </Form>
        </div>
      </Panel>
    </Collapse>
    <br>

      <Row style="text-align: center;">
        <h2 style="color:red">五 查询记录</h2>
      </Row>
      <Collapse v-model="value5">
        <Panel name="1">
          查询记录汇总
          <div slot="content">
            <Table :columns="columns7" :data="intBankQuerySummaryList" border></Table>
          </div>
        </Panel>
        <Panel name="2">
          查询记录
          <div slot="content">
            <Table :columns="columns5" :data="intBankQueryDetailList"></Table>
          </div>
        </Panel>
        <Panel name="3">
          个人查询记录
          <div slot="content">
            <Table :columns="columns6" :data="intBankBanruDetailList"></Table>
          </div>
        </Panel>

      </Collapse>

    </Card>
    </Col>
  </Row>
  </div>
</template>

<script>
import Viewer from '../../components/ykd-viewer.vue'
export default {
  components: {
    Viewer
  },
  data () {
    return {
      value1: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
      value2: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
      value3: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
      value4: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
      value5: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
      baseUrl: this.$appContext.marvels_core_approve,
      $ajax: null,
      loanId: null,
      columns: [
        {
          align: 'center',
          title: '被查询者姓名',
          key: 'applicantName'
        },
        {
          align: 'center',
          title: '被查询者证件类型',
          key: 'applicantIdType'
        },
        {
          align: 'center',
          title: '被查询者证件号码',
          key: 'applicantIdNbr'
        },
        {
          align: 'center',
          title: '被查操作员',
          key: 'operateName'
        },
        {
          align: 'center',
          title: '查询原因',
          key: 'inquiryType'
        }
      ],
      columns1: [
        {
          title: '序号',
          type: 'index',
          width: 70,
          align: 'center'
        },
        {
          align: 'center',
          title: '居住地址',
          key: 'curHomeAddress'
        },
        {
          align: 'center',
          title: '居住状况',
          width: 150,
          key: 'homeType'
        },
        {
          align: 'center',
          title: '信息更新日期',
          width: 180,
          key: 'curHomeStartdate'
        }
      ],
      columns2: [
        {
          title: '序号',
          type: 'index',
          width: 60,
          align: 'center'
        },
        {
          align: 'center',
          title: '工作单位',
          key: 'companyName'
        },
        {
          align: 'center',
          title: '单位地址',
          key: 'companyAddress'
        },
        {
          align: 'center',
          title: '职业',
          key: 'companyPosition'
        },
        {
          align: 'center',
          title: '行业',
          key: 'companyIndustry'
        },
        {
          align: 'center',
          title: '职务',
          key: 'companyDuty'
        },
        {
          align: 'center',
          title: '职称',
          key: 'companyProfessionalTitle'
        },
        {
          align: 'center',
          title: '进入本单位年份',
          key: 'companyRegistrationDate'
        },
        {
          align: 'center',
          title: '信息更新日期',
          key: 'curHomeStartdate'
        }
      ],
      columns5: [
        {
          title: '序号',
          type: 'index',
          width: 80,
          align: 'center'
        },
        {
          align: 'center',
          title: '查询日期',
          key: 'queryTheDate',
          width: 150
        },
        {
          align: 'center',
          title: '查询操作员',
          key: 'queryOperators'
        },
        {
          align: 'center',
          title: '查询原因',
          key: 'queryReason'
        }
      ],
      columns6: [
        {
          title: '序号',
          type: 'index',
          width: 80,
          align: 'center'
        },
        {
          align: 'center',
          title: '查询日期',
          key: 'queryTheDate',
          width: 150
        },
        {
          align: 'center',
          title: '查询操作员',
          key: 'queryOperators'
        },
        {
          align: 'center',
          title: '查询原因',
          key: 'queryReason'
        }
      ],
      columns7: [
        {
          title: '最近1个月内的查询机构数',
          align: 'center',
          children: [
            {
              title: '贷款审批',
              key: 'institutionLoanCount',
              align: 'center'
            },
            {
              title: '信用卡审批',
              key: 'institutionCreditCount',
              align: 'center'
            }
          ]
        },
        {
          title: '最近1个月内的查询数',
          align: 'center',
          children: [
            {
              title: '贷款审批',
              key: 'loanCount',
              align: 'center'
            },
            {
              title: '信用卡审批',
              key: 'creditCount',
              align: 'center'
            },
            {
              title: '本人查询',
              key: 'banruCount',
              align: 'center'
            }
          ]
        },
        {
          title: '最近2年内的查询次数',
          align: 'center',
          children: [
            {
              title: '贷后管理',
              key: 'postLoanCount',
              align: 'center'
            },
            {
              title: '担保资格审查',
              key: 'assuranceCount',
              align: 'center'
            },
            {
              title: '特约商户实名审查',
              key: 'contributingCount',
              align: 'center'
            }
          ]
        }
      ],
      intBankBasic: {}, // 个人基本信息
      dwellmessageList: [], // 居住信息
      intBankPositionmesageList: [], // 职业信息
      intBankCredittipsForm: {}, // 信用提示
      intBankNotCredittipsForm: {}, // 未结清贷款信息汇总
      intBankNotPinshouseholdsForm: {}, // 未销户贷记卡信息汇总
      intBankNotQuasiCreditForm: {}, // 未销户准贷记卡信息汇总
      intBankGuaranteeCountForm: {}, // 对外担保信息汇总
      intBankCreditPaymentJQList: [], // 贷款
      intBankCreditPaymentNJQList: [], // 贷款
      intBankCreditCardXhRecordList: [], // 贷记卡
      intBankCreditCardNXhRecordList: [], // 贷记卡------
      intBankStandardCreditCardsList: [], // 准贷记卡
      intBankEndowmentInsuranceForm: {}, // 养老保险金缴存记录
      intBankQuerySummaryList: [], // 查询记录汇总
      intBankQueryDetailList: [], // 查询记录
      intBankBanruDetailList: [] // 个人查询记录
      // viewerData: [],
      // tempIntBankBasicList: [],
      // tempIntBankDwellmessageList: [],
      // tempIntBankPositionmesageList: [],
      // tempIntBankQuerySummaryList: [],
      // tempIntBankQueryDetailList: [],
      // tempIntBankBanruDetailList: [],
      // rowData: null // 表格行对象
    }
  },
  methods: {
    initpage: function () {
      this.loadCredit()
    },
    // 征信报告
    loadCredit: function () {
      var params = {}
      params.loanId = this.$route.query.loanId
      params.serviceType = this.$route.query.serviceType
      params.reqNo = this.$route.query.reqNo
      var vm = this
      this.$ajax.get(this.baseUrl + '/approve/process/credit_reporting/service/getCreditDetail', { params: params }).then(re => {
        var data = re.data
        vm.intBankBasic = data.data.data.intBankBasic || {}
        vm.dwellmessageList = data.data.data.dwellmessageList || []
        vm.intBankPositionmesageList = data.data.data.intBankPositionmesageList || []
        vm.intBankCredittipsForm = data.data.data.intBankCredittipsForm || {}
        vm.intBankNotCredittipsForm = data.data.data.intBankNotCredittipsForm || {}
        vm.intBankNotPinshouseholdsForm = data.data.data.intBankNotPinshouseholdsForm || {}
        vm.intBankNotQuasiCreditForm = data.data.data.intBankNotQuasiCreditForm || {}
        vm.intBankGuaranteeCountForm = data.data.data.intBankGuaranteeCountForm || {}
        vm.intBankCreditPaymentJQList = data.data.data.intBankCreditPaymentJQList || []
        vm.intBankCreditPaymentNJQList = data.data.data.intBankCreditPaymentNJQList || []
        vm.intBankCreditCardXhRecordList = data.data.data.intBankCreditCardXhRecordList || []
        vm.intBankCreditCardNXhRecordList = data.data.data.intBankCreditCardNXhRecordList || []
        vm.intBankStandardCreditCardsList = data.data.data.intBankStandardCreditCardsList || []
        vm.intBankEndowmentInsuranceForm = data.data.data.intBankEndowmentInsuranceForm || {}
        vm.intBankQuerySummaryList = data.data.data.intBankQuerySummaryList || []
        vm.intBankQueryDetailList = data.data.data.intBankQueryDetailList || []
        vm.intBankBanruDetailList = data.data.data.intBankBanruDetailList || []
      }).catch(er => {
      })
    }
  },
  created () {
    this.$ajax = this.$util.ajax()
    this.initpage()
    document.getElementsByTagName('title')[0].innerText = '人行征信数据-核心管理系统'
  },

  props: {
    taskParams: Object
  }
}
</script>
<style lang="less">
.ivu-form-item {
  margin-bottom: 1px;
}
</style>
